<template>
    <div class="body">
      <div class="event-top-box">
        <div class="shux-box">
          <div></div>
        </div>
        <div class="exent-text-box">事件列表02</div>
      </div>
      <div class="info-bottom-box">
        <navs @changestate="changestate"></navs>
        <selects @changetype="changetype" @changepos="changepos"  ></selects>
        <infos :state="state" :type="type" :pos="pos" ></infos>
      </div>
    </div>
  </template>
  
  <script setup>
  import {ref} from "vue";
  import './layout.scss'
  import navs from './nav/nav.vue'
  import selects from './select/select.vue'
  import infos from './info/info.vue';

  const state= ref("pending");

  const changestate=(val)=>{
    state.value = val;
  }
  
  const type = ref("全部类型");
  const changetype=(val)=>{
    type.value = val;
  }

  const pos = ref("");
  const changepos=(val)=>{
    pos.value = val;
  }
  </script>
  